
import tpl from './index.html';

export default {
    template: tpl,
    // 接受外部数据及默认值
    propTypes: {
        value: {
            type: 'string',
            value: ''
        },
        placeholder: {
            type: 'string',
            value: '请输入...'
        },
        widthStyle: {
            type: 'string',
            value: '100%'
        },
        color: {
            type: 'string',
            value: '#fff'
        }
    },
    data: function(){
        return {
            test: 'test',
            show: false,
            value: '',
            keys: {
                "province": ["京", "津", "冀", "京", "津", "冀", "京", "津", "冀", "京", "津", "冀", "京", "津", "冀", "京", "津", "冀", "京", "津", "冀"],
                "police": ["总", "军", "海", "空", "炮", "WJ"],
                "other": ["警", "学", "挂", "使", "领"],
                "number": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
                "enkey": ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"],
                "quick": ["京", "皖"]
            }
        }
    },
    methods: {
        showPanel: function(){
            this.set('show', true)
        },
        hidePanel: function(){
            this.set('show', false)
        },
        add: function(value){
            this.showPanel();
            var newValue = this.get('value') + value;
            this.set('value', newValue);
            console.log(this.$el)
            $(this.$el).find('.hphm').focus();
        },
        del: function(){
            this.showPanel();
            var newValue = this.get('value');
            if(newValue.length <= 0){
                $(this.$el).find('.hphm').focus();
                return false;
            }
            var num = newValue.length;
            newValue = newValue.slice(0, num-1);
            this.set('value', newValue);
            $(this.$el).find('.hphm').focus();
        },
        getKeys: function(){
            var self = this;
            $.ajax({
                type: 'get',
                url: 'http://easy-mock.com/mock/reborn/its/vehicleInput',
                success:function(res){
                    if(res.success){
                        self.set('keys', res.data)
                    }else {
                        layer.msg('接口读取失败！'+res.msg, {icon: 2})
                    }
                },
                error:function(){
                    layer.msg('接口地址错误或连接异常');
                }
            })
        },
        creatEnKeys: function(){
            var enKey = [];
            for(var i=0;i<26;i++){
                var thisKey = String.fromCharCode((65+i));
                // console.log(thisKey)
                // console.log(thisKey !== 'O')
                if(thisKey == 'O' || thisKey == 'I'){
                    // 不管了，先留着
                    enKey.push(String.fromCharCode((65+i)))
                }else {
                    enKey.push(String.fromCharCode((65+i)))
                }
            }
            return enKey;
        }
    },
    watchers: {
        "value": {
            watcher: function(newValue){
                // 默认转大写
                this.set('value', newValue.toUpperCase())
                // 
                if(newValue.length>10){
                    this.del()
                }
            },
            sync: true
        }
    },
    afterMount: function(){
        // this.getKeys();
    }
};